<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
    <!-- <link rel="stylesheet" href="/css/头部导航栏.css">
    <link rel="stylesheet" href="/css/右边导航栏.css">
    <link rel="stylesheet" href="/css/底部导航栏.css">
    <link rel="stylesheet" href="/css/左边导航栏.css"> -->
    <link rel="stylesheet" href="css/index.css">
    <title>Document</title>
    
</head>
<body>

        <!-- 内嵌页面 -->
       <div id="chief">
        <header id="headers">
          <div id="logo"></div>
            <svg  t="1700036432929" id="page" class="icon1" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1904" width="20" height="20"><path d="M351.6 512.1L755 108.6c4.4-4.4 1.2-15-7.3-23.4L733 70.5c-8.4-8.4-19-11.7-23.4-7.3L269 503.8c-1.8 1.8-2.3 4.8-1.7 8.1-0.7 3.4-0.2 6.4 1.7 8.2l440.7 440.7c4.4 4.4 14.9 1.2 23.4-7.2l14.7-14.7c8.4-8.4 11.7-18.9 7.2-23.4L351.6 512.1z" fill="#e6e6e6" p-id="1905"></path></svg>
            <svg t="1700036347204" class="icon1" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1606" width="20" height="20"><path d="M672.4 512.1L269 108.6c-4.4-4.4-1.2-15 7.3-23.4L291 70.5c8.4-8.4 19-11.7 23.4-7.3L755 503.8c1.8 1.8 2.3 4.8 1.7 8.1 0.7 3.4 0.2 6.4-1.7 8.2L314.3 960.8c-4.4 4.4-14.9 1.2-23.4-7.2l-14.7-14.7c-8.4-8.4-11.7-18.9-7.2-23.4l403.4-403.4z" fill="#e6e6e6" p-id="1607"></path></svg>
    
            <input id="search" type="text" placeholder="输入要搜索的音乐">
          <div id="user">
            <li></li>
            <li>lililllll</li>
        </div>
            <div class="server">
                <li><svg t="1700059577107" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="10491" width="25" height="25"><path d="M947.575912 356.451318l-0.167823-0.163729a10.42749 10.42749 0 0 0-0.293689-0.270153L758.030951 166.949336c-18.015306-28.443819-48.545646-45.387723-81.914638-45.387723h-42.083467c-1.540076-0.357134-3.15383-0.532119-4.884241-0.532119-1.706875 0-3.261277 0.168846-4.631484 0.317225-1.022283 0.110517-1.987261 0.214894-2.753717 0.214894-9.875928 0-18.965957 3.302209-26.198685 8.919137l-16.525372 27.490098c-5.010107 32.832779-32.620955 56.663534-65.653279 56.663534-17.821901 0-34.603099-7.173376-47.25321-20.198018l-0.36225-0.35611c-9.369392-8.734942-15.789615-19.836791-18.565845-32.104186l-0.515746-2.272763a85.938278 85.938278 0 0 1-0.055259-0.73678 47.273676 47.273676 0 0 0-0.237407-2.580779l-0.138146-0.822738a42.400692 42.400692 0 0 0-2.071172-6.885827l-12.821003-17.452487c-7.450692-6.068206-16.916275-9.66308-27.01426-9.663081-0.765433 0-1.731434-0.105401-2.753717-0.214894-1.370207-0.148379-2.923586-0.317225-4.631484-0.317225-1.730411 0-3.344165 0.174985-4.883218 0.532119h-42.085514c-30.16809 0-58.115606 13.889335-76.788897 38.132482L77.099471 355.780029l-1.257644 0.884137-0.499373 0.913812c-15.59928 16.768919-15.250332 43.113937 1.057075 59.45102l3.021823 3.004427L214.764853 555.376926c7.865131 7.877411 18.332531 12.216229 29.475312 12.21623 2.889817 0 5.754051-0.288572 8.559957-0.855484v314.431295h5.89322c7.504928 13.285584 21.572318 21.804608 36.948517 21.804609H730.470245c15.371082 0 29.437449-8.510838 36.945447-21.784142h5.897314V567.120388c2.111081 0.316202 4.242627 0.475837 6.378267 0.475838 11.186783 0 21.674649-4.342912 29.519314-12.21623l138.366348-138.347928c16.696264-16.70138 16.696264-43.878346-0.001023-60.58075zM657.400043 190.769858l0.527002 0.363274c2.045589 1.414209 4.14746 2.867304 6.370082 4.003174l6.360871 5.589298 186.009437 186.02888-83.354429 83.350337v-11.211343l-85.687568-85.694731v444.081121H338.488713V371.09176l-85.688591 85.688591v15.456017l-83.535555-83.516112-1.974981-1.980098L352.481402 201.520713c2.850931-1.696642 5.79703-4.242627 9.110495-7.105838 1.266853-1.094938 3.045359-2.63092 4.774746-4.02671l7.181563 11.373025c23.808242 56.19486 78.472236 92.454692 139.511428 92.454692 29.356608 0 61.375859-12.966313 90.157369-36.510542 22.733771-18.597567 42.059931-42.560328 54.18304-66.935482z" p-id="10492" fill="#7a7a7c"></path></svg></li>
                <li><svg t="1700058897586" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="7491" width="20" height="20"><path d="M938.77 911h-854A78.88 78.88 0 0 1 6 832.2v-640a78.88 78.88 0 0 1 78.79-78.79h854a78.87 78.87 0 0 1 78.79 78.79v640a78.87 78.87 0 0 1-78.81 78.8z m-854-736.07a17.53 17.53 0 0 0-17.3 17.3v640a17.53 17.53 0 0 0 17.3 17.29h854a17.53 17.53 0 0 0 17.3-17.29v-640a17.53 17.53 0 0 0-17.3-17.3z" fill="#7a7a7c" p-id="7492"></path><path d="M512.38 612.78a87.54 87.54 0 0 1-58.6-21.91l-429-333.95 42.68-47.69 429 333.95c8.33 7.45 23.51 7.45 31.84 0l429-333.95 42.7 47.69-429 334a87.54 87.54 0 0 1-58.62 21.86z" fill="#7a7a7c" p-id="7493"></path></svg></li>
                <li><svg t="1700058973045" class="icon" viewBox="0 0 1084 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="8857" width="20" height="20"><path d="M1072.147851 406.226367c-6.331285-33.456782-26.762037-55.073399-52.047135-55.073399-0.323417 0-0.651455 0.003081-0.830105 0.009241l-4.655674 0c-73.124722 0-132.618162-59.491899-132.618162-132.618162 0-23.731152 11.447443-50.336101 11.546009-50.565574 13.104573-29.498767 3.023185-65.672257-23.427755-84.127081l-1.601687-1.127342-134.400039-74.661726-1.700252-0.745401c-8.753836-3.805547-18.334698-5.735272-28.479231-5.735272-20.789593 0-41.235746 8.344174-54.683758 22.306575-14.741683 15.216028-65.622973 58.649474-104.721083 58.649474-39.450789 0-90.633935-44.286652-105.438762-59.784516-13.518857-14.247316-34.128258-22.753199-55.127302-22.753199-9.945862 0-19.354234 1.861961-27.958682 5.531982l-1.746455 0.74078-139.141957 76.431283-1.643269 1.139662c-26.537186 18.437884-36.675557 54.579032-23.584845 84.062398 0.115506 0.264895 11.579891 26.725075 11.579891 50.634877 0 73.126262-59.491899 132.618162-132.618162 132.618162l-4.581749 0c-0.318797-0.00616-0.636055-0.01078-0.951772-0.01078-25.260456 0-45.672728 21.618157-52.002472 55.0811-0.462025 2.453354-11.313456 60.622322-11.313456 106.117939 0 45.494078 10.85143 103.659965 11.314996 106.119479 6.334365 33.458322 26.758957 55.076479 52.036353 55.076479 0.320337 0 0.651455-0.00616 0.842426-0.012321l4.655674 0c73.126262 0 132.618162 59.491899 132.618162 132.616622 0 23.760413-11.444363 50.333021-11.546009 50.565574-13.093793 29.474125-3.041666 65.646075 23.395414 84.151722l1.569346 1.093459 131.838879 73.726895 1.675611 0.7377c8.750757 3.84251 18.305437 5.790715 28.397607 5.790715 21.082208 0 41.676209-8.706094 55.0888-23.290689 18.724339-20.347588 69.527086-62.362616 107.04815-62.362616 40.625872 0 92.72537 47.100385 107.759669 63.583903 13.441852 14.831008 34.176001 23.689571 55.470741 23.695731l0.00616 0c9.895039 0 19.27877-1.883523 27.893999-5.598205l1.711034-0.73924 136.659342-75.531873 1.617088-1.128882c26.492523-18.456365 36.601633-54.600594 23.538642-84.016195-0.115506-0.267974-11.595291-27.082374-11.595291-50.67646 0-73.124722 59.49344-132.616622 132.618162-132.616622l4.517066-0.00154c0.300316 0.00616 0.599092 0.009241 0.899409 0.009241 25.331299-0.00154 45.785153-21.619697 52.107197-55.054918 0.112426-0.589852 11.325776-59.507301 11.325776-106.14104C1083.464388 466.640776 1072.609877 408.67356 1072.147851 406.226367zM377.486862 945.656142l-115.32764-64.487932c5.082277-13.052211 15.437801-43.51815 15.437801-75.017486 0-109.382917-84.176364-199.816642-192.587488-208.134635-2.647404-15.427021-8.873963-54.967133-8.873963-85.667166 0-30.65691 6.223479-70.232445 8.869343-85.671786 108.415744-8.311832 192.592108-98.745557 192.592108-208.134635 0-31.416171-10.300081-61.797405-15.371577-74.854236l122.721583-67.40331c0.003081 0 0.00462 0.00154 0.007701 0.00154 4.423121 4.518606 22.121764 22.080182 46.558275 39.493911 39.929754 28.46229 77.952885 42.894416 113.014434 42.894416 34.716571 0 72.437845-14.151831 112.115025-42.06431 24.282503-17.07953 41.896442-34.302288 46.308782-38.74543 0.009241-0.00154 0.018481-0.00462 0.026182-0.00616l118.301542 65.726159c-5.077657 13.055291-15.416239 43.499669-15.416239 74.958962 0 109.389077 84.174824 199.822802 192.590568 208.134635 2.645865 15.462442 8.872423 55.107281 8.872423 85.671786 0 30.687711-6.223479 70.241685-8.869343 85.673326C890.042174 606.334084 805.86427 696.767809 805.86427 806.158426c0 31.450053 10.317022 61.851309 15.393138 74.903519l-119.783103 66.198965c-5.168521-5.490399-22.603811-23.363073-46.740005-41.288109-40.701336-30.224145-79.662378-45.549521-115.800446-45.549521-35.79155 0-74.458435 15.038919-114.927219 44.694774C400.22004 922.554885 382.666163 940.255068 377.486862 945.656142zM731.271848 511.646647c0-105.803762-86.081448-191.88059-191.888289-191.88059-105.803762 0-191.88059 86.076827-191.88059 191.88059 0 105.803762 86.076827 191.882129 191.88059 191.882129C645.19194 703.528777 731.271848 617.450409 731.271848 511.646647zM539.383558 395.903184c63.825696 0 115.751164 51.922387 115.751164 115.743463 0 63.825696-51.925468 115.751164-115.751164 115.751164-63.821076 0-115.743463-51.925468-115.743463-115.751164C423.640095 447.824031 475.562482 395.903184 539.383558 395.903184z" fill="#7a7a7c" p-id="8858"></path></svg></li>
        </div>
       

            <div id="min"> <!-- 关闭等功能键 -->
                <svg t="1700057997417" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="26391" width="40" height="25"><path d="M512 1255.489906" p-id="26392" fill="#e6e6e6"></path><path d="M498.081951 943.76654" p-id="26393" fill="#7a7a7c"></path><path d="M772.963422 533.491105l-528.06716 0c-12.38297 0-22.514491-10.131521-22.514491-22.514491l0 0c0-12.38297 10.131521-22.514491 22.514491-22.514491l528.06716 0c12.38297 0 22.514491 10.131521 22.514491 22.514491l0 0C795.477913 523.359584 785.346392 533.491105 772.963422 533.491105z" p-id="26394" fill="#7a7a7c"></path></svg>
                <svg t="1700057807335" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="25309" width="20" height="20"><path d="M770.9 923.3H253.1c-83.8 0-151.9-68.2-151.9-151.9V253.6c0-83.8 68.2-151.9 151.9-151.9h517.8c83.8 0 151.9 68.2 151.9 151.9v517.8c0 83.8-68.1 151.9-151.9 151.9zM253.1 181.7c-39.7 0-71.9 32.3-71.9 71.9v517.8c0 39.7 32.3 71.9 71.9 71.9h517.8c39.7 0 71.9-32.3 71.9-71.9V253.6c0-39.7-32.3-71.9-71.9-71.9H253.1z" p-id="25310" fill="#7a7a7c"></path></svg>
              
            <svg t="1700057598807" class="icon" id="win-close" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="22588" width="20" height="20"><path d="M550.848 502.496l308.64-308.896a31.968 31.968 0 1 0-45.248-45.248l-308.608 308.896-308.64-308.928a31.968 31.968 0 1 0-45.248 45.248l308.64 308.896-308.64 308.896a31.968 31.968 0 1 0 45.248 45.248l308.64-308.896 308.608 308.896a31.968 31.968 0 1 0 45.248-45.248l-308.64-308.864z" p-id="22589" fill="#7a7a7c"></path></svg>
            </div>
           
        </header>

        <!-- 主要内容 -->
        <div id="center">
        <div id="content">
            <!-- 左边框 -->
            <div id="c-left">
                    <li>发现音乐</li>
                    <li>博客 </li>
                    <li>视频</li>
                    <li>关注</li>
                    <li>在线聊天</li>
                    <li>私人FM</li>
                    <p>我的音乐</p>
                    <li><svg t="1700062926738" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="16231" width="20" height="20"><path d="M698.4 158.3c61.8 0 120.1 28.3 160 77.7 68.1 84.2 58.1 215.1-22.6 297.8l-324 331.9-323.6-331.9C107.5 451 97.5 320.2 165.6 236c39.9-49.4 98.2-77.7 160-77.7 55.2 0 107.2 22.1 146.3 62.3l40.1 41.1 40.1-41.1c39.2-40.2 91.1-62.3 146.3-62.3m0-56c-67.5 0-134.9 26.4-186.4 79.2-51.5-52.8-118.9-79.2-186.4-79.2-75.3 0-150.5 32.8-203.6 98.5C33.4 310.5 49.6 472 148.1 572.9l323.6 331.9c11 11.3 25.7 17 40.3 17s29.2-5.7 40.3-17l323.6-331.9c98.5-101 114.7-262.4 26.1-372.1-53.1-65.7-128.3-98.5-203.6-98.5z" p-id="16232" fill="#dbdbdb"></path></svg> 我喜欢的音乐</li>
                    <li><svg t="1700063042212" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="18643" width="20" height="20"><path d="M896 864.384v96H128v-96h768zM564.096 64v506.176l201.376-201.44 67.84 67.84-316.768 316.8-316.8-316.8 67.904-67.84 200.448 200.416V64h96z" fill="#dbdbdb" p-id="18644"></path></svg> 本地与下载 </li>
                    <li><svg t="1700063104740" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="21634" width="20" height="20"><path d="M564.560588 521.384741c0.245593 1.474584 0.36839 2.986007 0.36839 4.5312 0 14.894222-12.135388 26.978445-26.941606 26.978445L340.089164 552.894386c-14.874779 0-26.940582-11.977799-26.940582-26.978445 0-14.892175 12.135388-26.975375 26.940582-26.975375l170.887019 0L510.976182 247.227708c0-14.962783 11.977799-27.047006 26.976398-27.047006 14.910595 0 26.976398 11.908214 26.976398 27.047006l0 269.625834C564.928978 518.398734 564.806181 519.909134 564.560588 521.384741z" fill="#dbdbdb" p-id="21635"></path><path d="M921.807015 422.505733C895.340223 219.549322 721.661625 62.817698 511.328199 62.817698c-210.315006 0-384.013047 156.731624-410.462442 359.688036l-3.529383 0c-20.004613 0-35.969213 16.158005-35.969213 36.109406l0 143.559627c0 19.916609 16.104793 36.145222 35.969213 36.145222l35.96819 0L133.304564 458.474946l0.421602 0c9.395998-200.252837 174.697811-359.689059 377.250016-359.689059 202.553229 0 367.856066 159.436222 377.25104 359.689059l0.421602 0 0 179.845041 35.96819 0c19.863397 0 35.96819-16.228613 35.96819-36.145222l0-143.559627c0-19.951401-15.9646-36.109406-35.96819-36.109406L921.807015 422.505733z" fill="#dbdbdb" p-id="21636"></path><path d="M97.335351 602.349751C131.969149 755.989967 252.116553 877.279381 405.160181 913.528979c5.585205 12.717649 18.318204 21.533432 33.123398 21.533432l143.577023 0c19.898189 0 36.127825-16.123212 36.127825-35.969213 0-20.019962-16.176424-35.967166-36.127825-35.967166L438.28358 863.126033c-11.784394 0-22.305005 5.653767-28.889981 14.399965-135.146003-33.615609-241.507426-140.010801-275.070846-275.175223L97.335351 602.350774z" fill="#dbdbdb" p-id="21637"></path></svg> 最近播放</li>
                    <li><svg t="1700063133328" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="22849" width="20" height="20"><path d="M256 768h469.333333a170.666667 170.666667 0 1 0-11.562666-340.949333l-32.341334 2.133333-10.752-30.549333A213.418667 213.418667 0 0 0 256 469.333333l0.042667 4.48 0.682666 33.792-32.725333 8.405334A128.085333 128.085333 0 0 0 256 768z m725.333333-170.666667a256 256 0 0 1-256 256H256a213.333333 213.333333 0 0 1-84.266667-409.386666A298.666667 298.666667 0 0 1 739.413333 341.76 256 256 0 0 1 981.333333 597.333333z" fill="#dbdbdb" p-id="22850"></path></svg> 我的音乐云盘</li>
                    <li><svg t="1700063192113" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="27328" width="20" height="20"><path d="M512 249.6c121.6 0 224 102.4 224 236.8 0 70.4-25.6 134.4-64 185.6 51.2-32 121.6-89.6 121.6-185.6C793.6 320 672 192 512 192 358.4 192 230.4 320 230.4 486.4c0 96 70.4 160 121.6 185.6-38.4-51.2-64-115.2-64-185.6 0-128 102.4-236.8 224-236.8zM512 32C268.8 32 76.8 236.8 76.8 486.4c0 70.4 12.8 128 38.4 185.6 51.2 115.2 147.2 185.6 262.4 217.6l-6.4-19.2c-89.6-44.8-160-134.4-198.4-224-25.6-44.8-38.4-102.4-38.4-160 0-217.6 166.4-390.4 377.6-390.4 204.8 0 377.6 172.8 377.6 390.4 0 160-96 320-230.4 390.4l-6.4 19.2c172.8-57.6 294.4-204.8 294.4-403.2 0-256-192-460.8-435.2-460.8z m0 524.8c-108.8 0-128 70.4-128 70.4-12.8 160 70.4 358.4 70.4 358.4s19.2 12.8 51.2 12.8 51.2-12.8 51.2-12.8 83.2-198.4 70.4-358.4c12.8-6.4-6.4-70.4-115.2-70.4zM416 422.4c0 57.6 44.8 102.4 96 102.4s96-44.8 96-102.4C608 364.8 563.2 320 512 320s-96 44.8-96 102.4z" p-id="27329" fill="#dbdbdb"></path></svg> 我的播客</li>
                    <li><svg t="1700063281758" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="31184" width="20" height="20"><path d="M703.9488 947.2a128.9728 128.9728 0 0 1-52.7872-11.3664l-119.4496-53.2992a67.8912 67.8912 0 0 0-53.4016-0.7168L357.4272 931.84a129.1264 129.1264 0 0 1-177.7152-133.12l13.7728-130.0992a67.6352 67.6352 0 0 0-15.8208-51.2l-84.8896-99.328a129.024 129.024 0 0 1 71.68-209.92l128-27.136a67.84 67.84 0 0 0 43.6224-30.72L404.48 138.6496a129.0752 129.0752 0 0 1 221.8496 3.072L691.2 255.0272a67.8912 67.8912 0 0 0 42.752 32l127.1808 30.72a129.1264 129.1264 0 0 1 65.6896 211.9168L839.68 626.688a67.84 67.84 0 0 0-17.2032 50.5344l10.24 130.4064A129.3824 129.3824 0 0 1 703.9488 947.2z m-199.68-131.8912a128.4096 128.4096 0 0 1 52.6336 11.1616l119.4496 53.248a67.6352 67.6352 0 0 0 94.976-67.0208l-10.24-130.4064a129.536 129.536 0 0 1 32.512-96.768l87.552-97.28a67.6352 67.6352 0 0 0-34.4064-111.0528l-127.1296-30.72a129.536 129.536 0 0 1-81.92-61.0304l-64.8704-113.0496a67.6352 67.6352 0 0 0-116.224-1.5872L388.1984 282.2656a129.4848 129.4848 0 0 1-83.3024 58.7776l-128 27.136a67.6352 67.6352 0 0 0-37.4272 110.08l84.8896 99.4816a129.792 129.792 0 0 1 30.208 97.28L240.64 805.1712a67.6352 67.6352 0 0 0 93.0816 69.632l120.8832-50.0224a129.024 129.024 0 0 1 49.5104-9.728z" fill="#dbdbdb" p-id="31185"></path><path d="M511.0272 609.6384h-8.448c-93.696-4.0448-156.16-74.24-158.72-77.2608a30.72 30.72 0 0 1 46.08-40.5504c0.9216 1.024 48.9472 53.8112 115.7632 56.32 43.264 1.7408 86.3232-17.92 128-58.2144a30.72 30.72 0 0 1 42.5984 44.2368c-51.6608 50.1248-107.52 75.4688-165.2736 75.4688z" fill="#dbdbdb" p-id="31186"></path></svg> 我的收藏</li>
                    <p>创建的歌单</p>
            </div>

            <!-- 右边框 -->
            <div id="c-right">
                <!-- 右边框菜单栏 -->
                <ul>
                <li style="border-bottom:3px solid red ;">个性推荐</li>
                <li>专属定制</li>
                <li>排行榜</li>
                <li>歌单</li>
                <li>歌手</li>
                <li>最新音乐</li></ul>
                <a href="https://music.163.com">  <div id="advertise"></div></a>
                <p>推荐歌曲></p>
                <ul id="recommend">
                    <div><img src="./images/r1.jpg" alt=""></div>
                    <div><img src="./images/r2.jpg" alt=""></div>
                    <div><img src="./images/r3.jpg" alt=""></div>
                    <div><img src="./images/r4.jpg" alt=""></div>
                    <div><img src="./images/R6.jpg" alt=""></div>
                </ul>
                <ul id="introduce">
                    <div id="introduce1">
                        <span>心拍数#0822</span><br>
                        <span>一之瀬ユウ/初音ミク</spa>
                    </div>
                    <div id="introduce2">
                        <span>アイロニ</span><br>
                        <span>majiko</span>
                    </div>
                    <div id="introduce3">
                        <span>Yuri on ICE</span><br>
                        <span>梅林太郎</span>
                    </div>
                    <div id="introduce4">
                        <span>万分之一的光</span><br>
                        <span>洛天依</span>
                    </div>
                    <div id="introduce5">
                        <span>雨き声残響</span><br>
                        <span>カバー</span>
                    </div>
                </ul>
            </div>
        </div>
    </div>
        <!-- 主要内容 -->


        <!-- 底部播放栏 -->
        <div id="playmusic">
        <!--左边内容 -->
        <div id="left-music"> 
        <div id="music-picture"></div>
        <!-- 收藏 -->
        <div id="icon2">
            <img id="icon2img1" src="./images/喜欢.png" alt="" width="20px" height="20px">
            <img id="icon2img2" src="./images/超级喜欢.png" alt="" width="20px" height="20px">
        </div>
        <span id="musicname">心拍数#0822</span><br>
        <span id="singer">一之瀬ユウ</span>
            <!-- 歌曲图片 -->
        </div>
        
        <div id="right-music">
            <!-- 音乐源 -->
        <audio src="./music/心拍数#0822.mp3"  ></audio>
        <div id="icon1"><svg t="1700053877907"  viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3739" width="25" height="25"><path d="M725.333333 170.666667V88.234667a21.333333 21.333333 0 0 1 34.986667-16.426667l175.786667 146.474667a21.333333 21.333333 0 0 1-13.696 37.717333H85.333333V170.666667h640zM85.333333 768h853.333334v85.333333H85.333333v-85.333333z m0-298.666667h853.333334v85.333334H85.333333v-85.333334z" p-id="3740" fill="#e6e6e6"></path></svg></div>
       <div id="playtool"><div id="last"><svg  t="1699530851511" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="8661" width="30" height="30"><path d="M803.584 134.592c-18.176-10.048-39.936-10.112-58.112 0L192 443.008l0-282.88c0-17.664-14.336-32-32-32S128 142.464 128 160.128l0 344.896C127.744 507.2 127.104 509.248 127.104 511.488S127.744 515.84 128 518.016l0 346.112c0 17.664 14.336 32 32 32s32-14.336 32-32L192 579.968l553.408 308.352C754.56 893.44 764.48 896 774.528 896s19.968-2.56 29.056-7.616c18.176-10.112 28.992-28.224 28.992-48.576L832.576 183.104C832.576 162.88 821.76 144.768 803.584 134.592zM768.192 829.248 198.016 511.488 771.328 192 768.192 829.248z" p-id="8662"></path></svg></div>
        <!--上一首  -->
       <div id="mplay"> <img id="mplaypng" src="./images/播放.png" alt=""> 
        <img src="./images/暂停 .png"  id="mplaypng1" alt="" >
        </div>
       <!-- 播放 -->
        <div id="after"><svg t="1699530669070" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="7645" width="30" height="30"><path d="M832 160.128c0-17.664-14.336-32-32-32S768 142.464 768 160.128l0 282.88L214.592 134.592c-18.176-10.112-39.936-10.048-58.112 0C138.24 144.768 127.424 162.88 127.424 183.168l0 656.64c0 20.224 10.816 38.464 29.056 48.576C165.568 893.44 175.488 896 185.472 896s19.968-2.56 29.056-7.616L768 579.968l0 284.096c0 17.664 14.336 32 32 32s32-14.336 32-32L832 160.128zM191.808 829.248 188.672 192l573.312 319.488L191.808 829.248z" p-id="7646"></path></svg></div></div>
        <!-- 下一首 -->
        <!-- 时间进度条 -->
       <div id="timetool">
        <!-- 外框 -->
        <div id="timeborder">
        <!-- 内嵌进度条 -->
        <div id="load"></div>
        </div>
        <span id="timestar">00:00</span>
        <span id="timeend">05:20</span>
      </div>


      <ul id="ul1">
        <li> <div id="voicepar">
        <img id="voice" src="./images/声音.png" alt="">
        <img id="voice1" src="./images/静音.png" alt=""> 
      </div>
    </li>
    <div id="changevoice">
    <input type="range"   step="0.1" id="input" max="1" min="0" value="1" >
       </div>  
      </ul>
      <div id="fn">
      <li><svg t="1700055624793" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="20127" width="22" height="22"><path d="M866.461538 571.076923H157.538462a39.384615 39.384615 0 0 1 0-78.769231h708.923076a39.384615 39.384615 0 0 1 0 78.769231z m-118.153846-374.153846H275.692308a39.384615 39.384615 0 0 1 0-78.769231h472.615384a39.384615 39.384615 0 0 1 0 78.769231zM275.692308 846.769231h472.615384a39.384615 39.384615 0 0 1 0 78.769231H275.692308a39.384615 39.384615 0 0 1 0-78.769231z" fill="#e6e6e6" p-id="20128"></path></svg></li>
      <li><svg t="1700055581856" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="18846" width="22" height="22"><path d="M248.482281 938.000324c-4.306072 0-8.592702-1.336438-12.211113-3.967358-6.395664-4.646833-9.600659-12.521175-8.264221-20.314675l48.430012-282.363949L71.288626 431.382914c-5.66093-5.519714-7.698333-13.772678-5.255701-21.291932 2.444679-7.519254 8.943696-13.000082 16.768919-14.137998l283.508006-41.195238L493.099535 97.853655c3.498684-7.089465 10.720156-11.577686 18.627243-11.577686 7.907087 0 15.127536 4.489244 18.627243 11.577686l126.788661 256.904091 283.510052 41.195238c7.823176 1.137916 14.322194 6.618744 16.766872 14.137998 2.442632 7.519254 0.405229 15.773242-5.255701 21.291932L747.012502 631.354342l48.430012 282.363949c1.336438 7.7935-1.868557 15.667841-8.264221 20.314675-6.399757 4.646833-14.878872 5.257747-21.874193 1.582031L511.726777 802.298666 258.146385 935.614997C255.107165 937.211355 251.789607 938.000324 248.482281 938.000324zM130.422422 431.011454 313.25654 609.228415c4.894474 4.7727 7.128351 11.647271 5.974062 18.385742l-43.163055 251.64532 225.994104-118.811989c6.048763-3.180436 13.282514-3.180436 19.331277 0l225.992057 118.811989-43.163055-251.64532c-1.154289-6.738471 1.079588-13.613042 5.974062-18.385742l182.833095-178.216961-252.665557-36.71418c-6.767124-0.983397-12.614296-5.233188-15.641235-11.362792L511.726777 153.97893 398.729214 382.934482c-3.025916 6.129604-8.874111 10.379395-15.639189 11.362792L130.422422 431.011454z" fill="#e6e6e6" p-id="18847"></path></svg></li>
      <li><svg t="1700055478402" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6548" width="22" height="22"><path d="M853.333333 533.333333a32 32 0 0 1 64 0v266.666667c0 64.8-52.533333 117.333333-117.333333 117.333333H224c-64.8 0-117.333333-52.533333-117.333333-117.333333V256c0-64.8 52.533333-117.333333 117.333333-117.333333h277.333333a32 32 0 0 1 0 64H224a53.333333 53.333333 0 0 0-53.333333 53.333333v544a53.333333 53.333333 0 0 0 53.333333 53.333333h576a53.333333 53.333333 0 0 0 53.333333-53.333333V533.333333z m-42.058666-277.333333l-89.792-95.402667a32 32 0 0 1 46.613333-43.861333l140.544 149.333333C927.861333 286.485333 913.376 320 885.333333 320H724.704C643.029333 320 576 391.210667 576 480v192a32 32 0 1 1-64 0V480c0-123.296 94.784-224 212.704-224h86.570667z" fill="#e6e6e6" p-id="6549"></path></svg></li>
      <li><svg t="1700055307523" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4001" width="22" height="22"><path d="M85.333333 768h426.666667v85.333333H85.333333v-85.333333z m0-298.666667h597.333334v85.333334H85.333333v-85.333334z m0-298.666666h853.333334v85.333333H85.333333V170.666667z m725.333334 476.586666V384h213.333333v85.333333h-128v298.666667a128 128 0 1 1-85.333333-120.746667z" p-id="4002" fill="#e6e6e6"></path></svg></li>
       </div> </div>
<!-- 右侧内容 -->

        </div>
       </div> 
       <img class="imgs" src="./images/r1.jpg" alt="">
       <img class="imgs" src="./images/r2.jpg" alt="">
       <img class="imgs" src="./images/r3.jpg" alt="">
       <img class="imgs" src="./images/r4.jpg" alt="">
       <img class="imgs" src="./images/一个人的城市.jpg" alt="">
       <img  class="imgs"  src="./images/r7.jpg" alt="">
      
      
      
      
      
     <script src="./js/play.js"></script>
    </body>
</html>